<template>
<!-- 头部个人信息标题 -->
  <van-nav-bar
  title="个人信息"
  left-arrow
  @click-left="onClickLeft"
/>
<!-- 个人信息栏 -->
<div class="information">
  <van-cell-group>
    <div class="head">
        <van-cell title="头像" :center="true"  :icon="personal?personal.user_avatar:'https://himg.bdimg.com/sys/portraitn/item/0b05f254'"
        to="index" />
    </div>
        <van-cell title="身份" is-link :center="true" :value="personal?personal.user_identity:'请选择'" to="identity" />
        <van-cell title="称呼" is-link :center="true" :value="personal?personal.user_nickname:'请输入'" to="nickname" />
        <van-cell title="联系方式" is-link :center="true" :value="personal?personal.user_phone:'未填写'" to="userphone" />
    <div class="main">
        <van-cell title="主营业务" is-link :center="true" :value="personal?personal.main_management:'请输入'"   />
        <van-cell title="绑定微信" is-link :center="true" :value="personal?personal.wechat:'未填写'"  />
    </div>
    <div class="footer">
        <van-cell title="退出账户" is-link :center="true"  @click='remove' />
    </div>
  </van-cell-group>
</div>
</template>
<script>
import { onBeforeMount,ref } from 'vue';
import router from "../../router/index.js";
export default {
  setup() {
      //头部点击跳转事件
    const onClickLeft = () => {
      router.go(-1)
    }
    let personal=ref(null)
    //发起请求获取个人信息
    const remove=()=>{
      if(window.confirm('确定要退出吗?')){
        window.localStorage.removeItem('token')
      }
    }
    onBeforeMount(()=>{
     let obj={};
     obj.token=window.localStorage.getItem('token');
     fetch('http://www.pudge.wang:5000/api/users/get',{
        method:'POST',
        headers:{
      　　'Content-Type': 'application/json;charset=utf-8'
      　　},
       body:JSON.stringify(obj)
      }).then(response=>response.json()).then(res=>{
        if(res.status===0){
          //user_identity为身份，0为其他，1为个体种植户，2为个体养殖户，3为企业种植户，4为企业养殖户，5为超市，6为餐饮店，7为酒店，8为中间商，9为家庭农场，10为批发商，11为电商，12为食堂，13为贸易公司
          switch(res.result.user_identity){
            case 0:
              res.result.user_identity='其他'
              break;
            case 1:
              res.result.user_identity='个体种植户'
              break;
            case 2:
              res.result.user_identity='个体养殖户'
              break;
            case 3:
              res.result.user_identity='企业种植户'
              break;
            case 4:
              res.result.user_identity='个体养殖户'
              break;
            case 5:
              res.result.user_identity='超市'
              break;
            case 6:
              res.result.user_identity='餐饮店'
              break;
            case 7:
              res.result.user_identity='酒店'
              break;
            case 8:
              res.result.user_identity='中间商'
              break;
            case 9:
              res.result.user_identity='家庭农场'
              break;
            case 10:
              res.result.user_identity='批发商'
              break;
            case 11:
              res.result.user_identity='电商'
              break;
            case 12:
              res.result.user_identity='食堂'
              break;
            case 13:
              res.result.user_identity='贸易公司'
              break;
          }
          console.log(res.result);
         personal.value=res.result
        }
      })
   })
    return {
      onClickLeft,
      personal,
      remove
    };
  },
   
  
};
</script>
<style>
.information {
  background-color: #f6f6f6;
}
.information .van-cell-group{
  background-color: transparent;
}
.information .head{
  margin-bottom: 20px; 
}
.information .van-cell__left-icon{
  width: 50px;
  height: 50px;
  display: block;
}
.information .van-cell{
  height: 50px;
}
.information .van-cell__left-icon img{
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.information .head .van-cell {
  height: 80px; flex-direction: row-reverse;
}
.information .van-cell::after{
  border-width: 3px;
 
}
.information .main {
  margin: 20px 0px;
}
.information .footer {
  padding-bottom: 50px;
}
</style>
